import { IonHeader, IonIcon, IonTitle, IonToolbar } from "@ionic/react";
import { arrowBack } from "ionicons/icons";
import { useHistory } from "react-router";

interface HeaderProps {
    title: string;
    endIcon?: string;
    endIconClick?: () => void;
}

export default function Header(props: HeaderProps) {
    const history = useHistory();
    const { title, endIcon, endIconClick } = props;

    return (
        <IonHeader>
            <IonToolbar>
                <IonIcon
                    icon={arrowBack}
                    slot="start"
                    onClick={() => {
                        console.log("返回上一页");
                        history.goBack();
                    }}
                ></IonIcon>
                <IonTitle>{title}</IonTitle>
                <IonIcon
                    icon={endIcon}
                    slot="end"
                    onClick={endIconClick}
                ></IonIcon>
            </IonToolbar>
        </IonHeader>
    );
}
